<!-- 云诺 https://app.witframe.com/market/list/index?uid=24 -->
<template>
	<view class="content">
		<u-sticky @fixed="showNav" @unfixed="hiddenNav" offsetTop="0" bgColor="#fffff">
			<u-tabs class="content-tabs" :list="productCategoryList" keyName="name" :lineColor="baseColor" @change="changeCategory"></u-tabs>
		</u-sticky>

		<view class="product-content" :style="'min-height:'+(systemHeight-80)+'px'">
			<yn-list :lists="productList" type="product"></yn-list>
			<u-loadmore :status="status" />
		</view>



		<yn-tabbar currentTab='product'></yn-tabbar>
	</view>
</template>

<script>
	import API from '@/common/api.js';
	var app = getApp();
	export default {
		data() {
			return {
				baseinfo: [],
				minappinfo: [],
				productCategoryList: [{ cid: 0, name: "全部" }],
				productList: [],
				isLastPage: false,
				status: "loading",
				page: 1,
				curr_cid: 0,
				systemHeight: 400,
				showNavs: false,
				baseColor : '#2d96ff',
			}
		},
		onLoad(options) {
			this.baseinfo = uni.getStorageSync('baseinfo');
			this.minappinfo = uni.getStorageSync('minappinfo');
			
			this.getProductsCategory();
			this.getProducts();
			this.systemHeight = uni.getSystemInfoSync().windowHeight;
		},
		onReady() {
			if(this.minappinfo.bgColor){
				this.baseColor = this.minappinfo.bgColor;
			}
		},
		onPageScroll(res) {
			if (res.scrollTop > 80) {
				this.title = this.minappinfo.tName ? this.minappinfo.tName : "云诺服务";
				this.option = true
			} else {
				this.title = " ";
				this.option = false
			}

		},
		onShareAppMessage: function() {
			let title = this.minappinfo.tShareName ? this.minappinfo.tShareName : '云诺服务';
			let img = this.minappinfo.tLogo ? this.minappinfo.tLogo : '../../images/default.png'

			return {
				title: title,
				imageUrl: img,
				path: '/pages/index/index'
			}
		},
		onShareTimeline: function(res) {
			let title = this.minappinfo.tShareName ? this.minappinfo.tShareName : '云诺服务';
			let img = this.minappinfo.tLogo ? this.minappinfo.tLogo : '../../images/default.png'
			if (this.minappinfo.tShareDesc) {
				title = this.minappinfo.tShareName + " - " + this.minappinfo.tShareDesc
			}
			return {
				title: title,
				imageUrl: img,
				path: '/pages/index/index'
			}
		},
		onReachBottom() {
			if (!this.isLastPage) {
				this.getProducts({
					cid: this.curr_cid,
					page: this.page
				})

			}
		},
		onPullDownRefresh() {
			this.page = 1;
			this.isLastPage = true;
			this.status = "loading";
			this.productCategoryList = [{ cid: 0, name: "全部" }];
			this.productList = [];
			this.getProductsCategory();
			this.getProducts({
				cid: this.curr_cid,
				page: this.page
			})
			uni.stopPullDownRefresh(); //停止刷新
		},
		methods: {
			getProductsCategory: function(args) {
				API.getProductsCategory(args).then(res => {
						let productcategory = [];
						let arr = res.data.data;

						arr.forEach(function(i, index) {
							productcategory[index] = { cid: 0, name: "" };
							productcategory[index]['cid'] = i['_id'];
							productcategory[index]['name'] = i['tName'];
						})

						this.productCategoryList = this.productCategoryList.concat(productcategory);
						//console.log(this.productCategoryList);
					})
					.catch(err => {
						console.log(err);
					})
			},
			getProducts: function(args) {
				API.getProducts(args).then(res => {
						if (res.data.data.length < 10 || res.data.data == [] || res.data.data == null) {
							this.isLastPage = true;
							this.status = "nomore";
						}

						let product = [];
						let arr = res.data.data;
						arr.forEach(function(i, index) {
							product[index] = i;
							if (i['tPhoto']) {
								product[index]['tPhoto'] = API.getApiUrl() + '/cos/img?key=' + i['tPhoto'];
							} else {
								product[index]['tPhoto'] = '/static/images/default.png';
							}
						})

						this.productList = this.productList.concat(product);

						this.page = this.page + 1;
						console.log(this.page);
						this.isLoading = false;
					})
					.catch(err => {
						console.log(err);
					})
			},
			changeCategory: function(i) {
				this.curr_cid = i.cid;
				this.productList = [];
				this.page = 1;
				this.isLastPage = false;
				this.status = "loading";
				if (this.current == 0) {
					this.getProducts({
						page: this.page
					})
				} else {
					this.getProducts({
						cid: this.curr_cid,
						page: this.page
					})
				}
			},
			showNav: function() {
				let _this = this;
				setTimeout(function() {
					_this.showNavs = true;
				}, 1000);


			},
			hiddenNav: function() {
				let _this = this;
				setTimeout(function() {
					_this.showNavs = false;
				}, 1000);
			},
		}
	}

</script>

<style lang="scss" scoped>
	.content-tabs,.u-tabs{
		background-color: #ffffff;
	}

</style>

